<template>
  <el-select v-bind:value="form.value" :placeholder="defaultOption" size="mini" @change="_changeItem" :disabled="isdisabled">
    <el-option :label="defaultOption" :value="null" v-if="!isrequired"></el-option>
    <el-option  v-for="(item,index) in listData" :key="index"  :label="item[props.name]" :value="item[props.id]"></el-option>
  </el-select>
</template>
<script>
  import ApiClient from '@/utils/ApiClient'
  export default {
    name:'AppSelector',
    props:{
      url:{type:String},
      value:{type:Number,default:null},
      defaultOption:{type:String,default:'全部'},
      isPublicApi: false, // 属性url是否是共通api
      //是否有必选项
      isrequired:{type:Boolean,default:false},
      //是否可操作
      isdisabled:{type:Boolean,default:false},
      props:{type:Object,default:()=>{return {name:'name',id:'id'}}}
    },
    data(){
      return {
        listData:[],
        // form:{
        //   value: null,
        // },
      }
    },
    computed: {
      form() {
        return {
          value: this.value
        }
      }
    },
    methods:{
      _changeItem(value1){
        this.form.value = value1;
        this.$emit('input',value1);
        this.$emit('changeItem');
      }
    },
    mounted(){
        ApiClient.get(this.url,{page:1,size:9999}).then(data=>{
          //返回数据不一样，加了判断
          if(this.props.name==='floorName' || this.isPublicApi) this.listData = data;
          else this.listData = data.items
        });
        // console.log("thisValue: ",this.vaule); // undefined
        // this.form.value = this.value
    },
    updated(){
      this.form.value = this.value
    }
  }
</script>
